<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://java.sun.com/jsf/core">

    <ui:composition template="layout.xhtml">
        <ui:define name="body">
            <div class="section">
                <h1>Editando</h1>
                <h:form id="formCustomer">
                    <p:growl id="msg" life="3000"/>
                    <div class="container_24 clearfix">

                        <p:panel header="Dados Gerais" id="panelDados" >
                            <p:outputLabel value="Nome:" styleClass="grid_3" for="name" />
                            <p:inputText styleClass="grid_19 ajustInput"
                                         required="true" requiredMessage="Campo nome é obrigatório" 
                                         id="name" value="#{managerSearchCustomer.editCustomer.name}" />


                            <p:outputLabel value="Cpf:" styleClass="grid_3" for="cpf" />
                            <p:inputMask mask="999.999.999-99" required="true" requiredMessage="Campo CPF é obrigatório" id="cpf" styleClass="grid_8" value="#{managerSearchCustomer.editCustomer.cpf}" />
                            <p:outputLabel value="RG:" styleClass="grid_3" />
                            <p:inputText styleClass="grid_8" maxlength="12" value="#{managerSearchCustomer.editCustomer.rg}" />


                            <p:outputLabel value="Sexo: " styleClass="grid_3"/>
                            <div class="grid_8"> 
                                <p:selectOneMenu panelStyle="width:150px;" value="#{managerSearchCustomer.editCustomer.gender}">  
                                    <f:selectItem itemLabel="" itemValue="" />  
                                    <f:selectItems value="#{managerSearchCustomer.gender}" />  
                                </p:selectOneMenu>  
                            </div>
                            <p:outputLabel value="Profissão:" styleClass="grid_3" style="left: 10px;" /> 
                            <p:inputText styleClass="grid_8" style=" left: 10px;" 
                                         value="#{managerSearchCustomer.editCustomer.profession}" />

                            <div class="clear-both" />

                            <p:outputLabel value="Nacionalidade:" styleClass="grid_3 nationalityLabel" />
                            <p:inputText styleClass="grid_8" value="#{managerSearchCustomer.editCustomer.nationality}"/>
                            <p:outputLabel value="Estado Civil: " styleClass="grid_3"/>
                            <div class="grid_8">
                                <p:selectOneMenu id="ecivil" panelStyle="width:150px;" 
                                                 value="#{managerSearchCustomer.editCustomer.civilStatus}">  
                                    <f:selectItem itemLabel="" itemValue="" />  
                                    <f:selectItems value="#{managerSearchCustomer.civilStatus}" /> 
                                     <p:ajax event="change"  update="@form" process=":formCustomer:ecivil" 
                                             listener="#{managerSearchCustomer.ajaxTypeCivisStatus()}" />
                                </p:selectOneMenu> 
                            </div>

                            <p:outputLabel value="Data Nasc.:" styleClass="grid_3 dataNascLabel"  />
                            <p:calendar showOn="button" styleClass="grid_8"
                                        pattern="dd/MM/yyyy"
                                       
                                        id="dataNasc"
                                       
                                        value="#{managerSearchCustomer.editCustomer.dateOfBirth}"/>
                            <p:outputLabel value="Telefone:" styleClass="grid_3" style="left: 10px;"   />
                            <p:inputMask mask="(99)9999-9999" styleClass="grid_8" value="#{managerSearchCustomer.editCustomer.fixedPhone}" 
                                         style=" left: 10px;"/>

                            <p:outputLabel value="Celular:" styleClass="grid_3" />
                            <p:inputMask mask="(99)9999-9999" styleClass="grid_8" value="#{managerSearchCustomer.editCustomer.celPhone}" />
                            <p:outputLabel value="Email:" styleClass="grid_3" />
                            <p:inputText styleClass="grid_8" value="#{managerSearchCustomer.editCustomer.email}" />
                            <div class="clear"/>
                        </p:panel>
                        <br/>

                       

                        <p:panel id="endereco" header="Endereço">

                            <p:outputLabel value="Rua:" styleClass="grid_3" />
                            <p:inputText styleClass="grid_19 ajustInput" value="#{managerSearchCustomer.address.patio}" />

                            <p:outputLabel value="Cep:" styleClass="grid_3" />
                            <p:inputMask mask="99.999-999" styleClass="grid_8" value="#{managerSearchCustomer.address.cep}" />



                            <p:outputLabel value="Bairro:" styleClass="grid_3" />
                            <p:inputText  styleClass="grid_8" value="#{managerSearchCustomer.address.district}" />
                            <p:outputLabel value="Complemento:" styleClass="grid_3 complementLabel" />
                            <p:inputText styleClass="grid_8"  value="#{managerSearchCustomer.address.complement}" />

                            <p:outputLabel value="Nº:" styleClass="grid_3" />
                            <p:inputText styleClass="grid_8" value="#{managerSearchCustomer.address.num}" />
                            <p:outputLabel  value=" Cidade: " styleClass="grid_3"  />
                            <p:autoComplete styleClass="grid_8" dropdown="true" converter="cityconverter"   
                                            var="cityValue" itemLabel="#{cityValue.name.toString().concat(' - ')}#{cityValue.country.sgl}" 
                                            itemValue="#{cityValue}" value="#{managerSearchCustomer.city}"
                                            scrollHeight="200" forceSelection="true"
                                            completeMethod="#{managerSearchCustomer.autocompleteCity}" /> 


                            <p:outputLabel value="Tipo: " styleClass="grid_3" style="left: 10px"/>
                            <div class="grid_8" style="left: 10px" >
                                <p:selectOneMenu panelStyle="width:150px;" value="#{managerSearchCustomer.address.typeAddress}">  
                                    <f:selectItem itemLabel="" itemValue="" />  
                                    <f:selectItems value="#{managerSearchCustomer.typeAddress}" />  
                                </p:selectOneMenu> 
                            </div>
                            <div class="clear"/>


                            <div class="buttonAction">
                                <p:commandButton value="Adicionar"
                                                 actionListener="#{managerSearchCustomer.addAddress()}"
                                                 update=":formCustomer:endereco, tableAdd"
                                                 process=":formCustomer:endereco"
                                                 icon="ui-icon-plus"/>
                                <p:commandButton value="Limpar" icon="ui-icon-close" actionListener="#{managerSearchCustomer.cleanAddress()}" 

                                                 update=":formCustomer:endereco" process="@this" />

                            </div>

                            <p:dataTable id="tableAdd" var="address" value="#{managerSearchCustomer.addresses}" 
                                         styleClass="grid_24"
                                         rowIndexVar="rowid"
                                         emptyMessage="Nenhum registro">  
                                <f:facet name="header">
                                    Endereço
                                </f:facet>
                                <p:column headerText="Rua" width="300">  
                                    <h:outputText value="#{address.patio}"/>
                                </p:column>  
                                <p:column headerText="Bairro">  
                                    <h:outputText value="#{address.district}"/>
                                </p:column>
                                <p:column headerText="Tipo">  
                                    <h:outputText value="#{address.typeAddress}"/>
                                </p:column>

                                <p:column headerText="Ação" width="75">
                                    <p:commandButton  style="width: 20px; height: 20px;" 
                                                      update="@form, tableAdd"

                                                      actionListener="#{managerSearchCustomer.edit(address,rowid)}"
                                                      icon="ui-icon-pencil"/>
                                    <p:commandButton  style="width: 20px; height: 20px;" 
                                                      update="@form, tableAdd"

                                                      actionListener="#{managerSearchCustomer.remove(rowid)}"
                                                      icon="ui-icon-trash"/>
                                </p:column>
                            </p:dataTable>
                            <div class="clear"/>
                        </p:panel>


                        <br/>
                        <p:panel header="Cônjuge" id="panelConj" rendered="#{managerSearchCustomer.editCustomer.civilStatus.name eq 'CASADO'}">

                            <p:outputLabel value="CPF:" styleClass="grid_3" for="conjCpf" />
                            <p:inputMask id="conjCpf" mask="999.999.999-99" styleClass="grid_8" 
                                         required="true"
                                         value="#{managerSearchCustomer.conjugue.cpf}">
                                <p:ajax event="blur" process=":formCustomer:conjCpf"  update=":formCustomer:conjCpf,:formCustomer:conjNome,:formCustomer:conjRg "
                                        listener="#{managerSearchCustomer.customerExist()}" />
                            </p:inputMask>  
                            <div class="clear-both"/>
                            <p:outputLabel  value="Nome:" styleClass="grid_3" for="conjNome" />
                            <p:inputText id="conjNome" styleClass="grid_19 ajustInput"
                                         required="true"
                                         value="#{managerSearchCustomer.conjugue.name}" />


                            <p:outputLabel  value="RG:" styleClass="grid_3" />
                            <p:inputText  id="conjRg" styleClass="grid_8" maxlength="12" value="#{managerSearchCustomer.conjugue.rg}" />
                            <p:outputLabel value="Contato:" styleClass="grid_3 dataNascLabel"  />
                            <p:inputMask mask="(99)9999-9999" styleClass="grid_8" 
                                         value="#{managerSearchCustomer.conjugue.celPhone}" />
                         <div class="clear"/>
                        </p:panel>
                       
                       
                        <p:fileUpload 
                            mode="advanced"  
                            label="Anexar"
                            fileUploadListener="#{managerSearchCustomer.handle}"
                            multiple="true" 
                            auto="true"
                            invalidFileMessage="Tipo de arquivo não suportado."
                            invalidSizeMessage="Tamanho do arquivo não é suportado"
                            uploadLabel="Enviar"
                            cancelLabel="Cancelar"
                            immediate="false"
                            update="msg"
                            allowTypes="/(\.|\/)(gif|tif|jpe?g|png|pdf)$/"/> 

                        <div class="buttonAction">
                            <p:commandButton value="Atualizar" 
                                             actionListener="#{managerSearchCustomer.update()}"
                                             update="@form" 
                                             icon="ui-icon-disk" 
                                             styleClass="ui-priority-primary"/>

                            <p:button value="Voltar"
                                      href="searchcustomer.xhtml"
                                      icon="ui-icon-arrowreturnthick-1-w"/>
                        </div>
                    </div>
                </h:form>
            </div>
        </ui:define>
    </ui:composition>

</html>
